<template>
  <div class="apply">
    <Navigation :logoName="logoName" :routeInfo="routeInfo"></Navigation>
    <div>
      <div class="filter">
        <div class="fonttitle">筛选</div>
        <div class="filterCon">
          案件编号&nbsp;&nbsp;&nbsp;<Input placeholder="请输入编号" style="width: 300px" v-model="caseno"/>
          <span class="applyTime">受理时间&nbsp;&nbsp;&nbsp;
            <DatePicker type="datetimerange" v-model="dateduring" placeholder="请选择日期" style="width:350px" @on-change='datepicker'></DatePicker>
          </span>
          审核状态&nbsp;&nbsp;&nbsp;<Select style="width:200px" v-model="states">
              <Option value="3" key="3">全部</Option>
              <Option value="1" key="1">已审核</Option>
              <Option value="2" key="2">已裁决</Option>
              <Option value="0" key="0">未审核</Option>
          </Select>
          <span class="btn btn-filterTable" @click="filterCase()">筛选</span>
        </div>
      </div>
      <div class="table">
        <div class="titlename">
          <div class="fonttitle">仲裁审批受理记录</div>
        </div>
        <div class="tablecontent">
          <Table :loading="loading" max-height="470" :columns="columns7" :data="data6"></Table>
        </div>
        <div class="page-show"><Page :total="totalSize" :current="current" @on-change="pagechange" :page-size="8"/></div>
      </div>
    </div>
    
  </div>
</template>

<script>
import Navigation from '../common/navigation'
export default {
  name: 'Arbitratordirector',
  data(){
     return {
       logoName:'仲裁立案受理',
       routeInfo:'首页/仲裁立案受理',
       caseno:'',
       states:'',
       startTime:'',
       loading:true,
       endTime:'',
       dateduring:'',
       totalSize:0,
       current:1,
       columns7: [
                    {
                        title: '序号',
                        width: 70,
                        key: 'id'
                    },
                    {
                        title: '案件编号',
                        width: 150,
                        key: 'caseNo',
                        render: (h, params) => {
                          let param=params.row.caseNo;
                          return h('div', [
                                h('span', {
                                },param&&param.length>=25?param.substr(0,25)+'...':param)])
                        }
                    },
                    {
                        title: '申请人',
                        key: 'appName',
                        width:110,
                        render: (h, params) => {
                          let param=params.row.appName;
                          return h('div', [
                                h('span', {
                                },param&&param.length>=10?param.substr(0,10)+'...':param)])
                        }
                    },
                    {
                        title: '申请人代理人',
                        key: 'appLawyerName',
                        width:120,
                        render: (h, params) => {
                          let param=params.row.appLawyerName;
                          return h('div', [
                                h('span', {
                                },param&&param.length>=10?param.substr(0,10)+'...':param)])
                        }
                    },
                    {
                        title: '被申请人',
                        key: 'resName',
                        width:100,
                        render: (h, params) => {
                          let param=params.row.resName;
                          return h('div', [
                                h('span', {
                                },param&&param.length>=10?param.substr(0,10)+'...':param)])
                        }
                    },
                    {
                        title: '被申请人代理人',
                        key: 'resLawyerName',
                        width:140,
                        render: (h, params) => {
                          let param=params.row.resLawyerName;
                          return h('div', [
                                h('span', {
                                },param&&param.length>=10?param.substr(0,10)+'...':param)])
                        }
                    },
                    {
                        title: '第三人',
                        key: 'dsfName',
                        width:100,
                        render: (h, params) => {
                          let param=params.row.dsfName;
                          return h('div', [
                                h('span', {
                                },param&&param.length>=10?param.substr(0,10)+'...':param)])
                        }
                    },
                    {
                        title: '第三方代理人',
                        key: 'dsfLawyerName',
                        width:120,
                        render: (h, params) => {
                          let param=params.row.dsfLawyerName;
                          return h('div', [
                                h('span', {
                                },param&&param.length>=10?param.substr(0,10)+'...':param)])
                        }
                    },
                    {
                        title: '受理时间',
                        width: 170,
                        key: 'acceptTime'
                    },
                    {
                        title: '案由',
                        key: 'caseReason',
                        width: 240,
                        render: (h, params) => {
                          let param=params.row.caseReason;
                          return h('div', [
                                h('span', {
                                },param&&param.length>=13?param.substr(0,13)+'...':param)])
                        }
                    },
                     {
                        title: '适用程序',
                        width:120,
                        key: 'process'
                    },
                    {
                        title: '案件状态',
                        key: 'status',
                        width:120,
                        render: (h, params) => {
                          return h('div', [
                                h('span', {
                                }, params.row.status==1?'已审核':(params.row.status==2?'已裁决':'未审核'))])
                        }
                    },               
                    {
                        title: '操作',
                        key: 'action',
                        width: 200,
                        align: 'center',
                        render: (h, params) => {
                            return params.row.status==1?h('div', [
                                h('span', {
                                    style: {
                                        marginRight: '5px',
                                        color:'#1a7bfe',
                                        cursor:'pointer'
                                    },
                                    on: {
                                        click: () => {
                                            this.detail(params)
                                        }
                                    }
                                }, '查看'),
                                h('span', {
                                    style: {
                                        marginLeft: '5px',
                                        color:'#1a7bfe',
                                        cursor:'pointer'
                                    },
                                    on: {
                                        click: () => {
                                            this.createApplication(params)
                                        }
                                    }
                                }, '出裁决书')
                            ]):(params.row.status==0?h('div', [
                                h('span', {
                                    style: {
                                        marginRight: '5px',
                                        color:'#1a7bfe',
                                        cursor:'pointer'
                                    },
                                    on: {
                                        click: () => {
                                            this.detail(params)
                                        }
                                    }
                                }, '查看'),
                                h('span', {
                                    style: {
                                        marginRight: '5px',
                                        color:'#1a7bfe',
                                        cursor:'pointer'
                                    },
                                    on: {
                                        click: () => {
                                            this.verify(params)
                                        }
                                    }
                                }, '审理')
                            ]):h('div', [
                                h('span', {
                                    style: {
                                        marginRight: '5px',
                                        color:'#1a7bfe',
                                        cursor:'pointer'
                                    },
                                    on: {
                                        click: () => {
                                            this.detail(params)
                                        }
                                    }
                                }, '查看')
                            ]));
                        }
                    }
                ],
                data6: []
            }
  },
  props: {
    msg: String
  },
  computed: {
    isFollow () {
      return this.$store.state.needAmont;
    }
  },
  watch: {
    isFollow () {
      //do something
      this.dateduring=''
      this.caseno=''
      this.startTime='';
      this.endTime='';
      this.states='0';
      this.filterCase(1)
    }
  },
  methods:{
    pagechange(param){
      this.filterCase(param)
    },
    createApplication(param){
      this.$router.push({name:'ArbitratorVerifyCreateApply',params:{caseno:param.row.caseNo}});
    },
    filterCase(param=1){
         let params='?pageNum='+param+'&pageSize=8&caseNo='+this.caseno+'&startTime='+this.startTime+'&endTime='+this.endTime+'&status='+(this.states=='3'?'':this.states);
         this.current=param;
         this.list(params)
    },
    datepicker(param){
       this.startTime=param[0];
       this.endTime=param[1];
    },
    verify(param){
      // this.$http.post('/api'+this.urls.getCaseDetail,{caseNo:param.row.caseNo}).then((result)=>{
      //     if(result.data.code==200){
              this.$router.push({name:'ArbitratorVerify',params:{caseno:param.row.caseNo}});
      //     }else{
      //       this.$Message.warning('网络错误');
      //     }
      // });
    },
    detail(param){
      // this.$http.post('/api'+this.urls.getCaseDetail,{caseNo:param.row.caseNo}).then((result)=>{
      //       if(result.data.code==200){
                // this.basicInfo=result.data.data;
                this.$router.push({name:'ArbitratorVerifyDetail',params:{caseno:param.row.caseNo}});
        //     }else{
        //       this.$Message.warning('网络错误');
        //     }
        // })
      // this.$router.push({name:'ArbitratorVerifyDetail',params:{caseno:param.row.caseNo}});
    },
    list(param='?pageNum=1&pageSize=8'){
      this.$http.post('/api'+this.urls.getCases+param).then((result)=>{
            if(result.data.code==200&&result.data.data.list.length>0){
                this.loading=false;
                this.data6=result.data.data.list;
                this.totalSize=result.data.data.total;
            }else{
              this.loading=false;
              this.totalSize=result.data.data.total;
              this.data6=[];
            }
      }) 
    }
  },
  components:{Navigation},
  mounted(){
    this.list()
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .fonttitle{
    font-size: 16px;
  }
  
  .btn{
    background: #2e37cb;
    color: #fff;
    line-height: 30px;
    width: 120px;
    height: 30px;
    display: inline-block;
    margin-left: 50px;
    text-align: center;
    cursor: pointer;
  }
  .filterCon{
    margin: 20px;
  }
  .applyTime{
    margin: 0 40px;
  }
</style>
